表の作成
今週は、ホームページ作成の初心者を対象にホームページの基本を紹介します。テーマは「表の作成方法」です。表を作成するタグ「TABLE」は、ホームページで最もよく利用するタグのひとつです。ぜひとも使用方法をマスターしておきましょう。

→ 表作成の基本
 
表を作成する場合は、まず最初に「TABLE」〜「/TABLE」タグで表の領域を確保します。続いて、各行、各列の内容を記述していきますが、この手順は、行→列の順で作成します。つまり、1行目、2行目、3行目…という順番でセル（マス）の内容を記述していくわけです。行の区切りには「TR」〜「/TR」タグ、列の区切りには「TD」〜「/TD」タグを使用するようにしてください。行→列の順番で記述する都合上、実際にセルに表示する内容は列の区切りとなる「TD」〜「/TD」タグ内に記述します。なお、「TABLE」タグには、border属性を追加し、ピクセル数で表の線幅を指定するようにします。この指定を忘れると表の線幅が0（表の区切り線が表示されない）となってしまいます。


→ 表の作成例
 
初めて表を作成する人にとっては、上記の解説だけでは少しわかりにくいかもしれません。そこで、もう少し具体的な例を用いて表の作成方法を詳しく解説していきましょう。ここでは、例として2行3列の表を作成します。具体的な作成手順は、以下のようになります。
  1. 「TABLE」タグと「/TABLE」タグを記述します。「TABLE」タグではborder属性で線幅を指定します。
  2. 「TABLE」「TABLE」タグ内に「TR」「/TR」タグを記述し、1行目を確保します。
  3. 手順2で作成した「TR」タグ内に「TD」「/TD」タグを記述します。また、「TD」タグ内に1行1列目の内容を記述します。
  4. 手順3をもう2回繰り返し、1行2列目、1行3列目の内容を記述します。
  5. 手順2〜4を繰り返し、2行目を記述します。
このようにして作成した表のサンプルHTMLは以下のようになります。
<HTML>
<HEAD>
  <TITLE>初めてのホームページ作成</TITLE>
</HEAD>

<BODY>
表の作成例<BR>

<TABLE border="2">
  <TR>
    <TD>カメラ</TD>
    <TD>テレビ</TD>
    <TD>ビデオ</TD>
  </TR>
  <TR>
    <TD>camera</TD>
    <TD>television</TD>
    <TD>video</TD>
  </TR>
</TABLE>

</BODY>

</HTML>


→ 見出しの作成
 
表では、1行目や1列目を“見出し”として扱う場合も多くあります。見出しとするセル（マス）は、「TD」〜「/TD」タグの代わりに「TH」〜「/TH」タグを使用するとよいでしょう。「TH」〜「/TH」タグのセルは、そのセル内の文字が太字、中央揃えで表示されます。
<HTML>
<HEAD>
  <TITLE>初めてのホームページ作成</TITLE>
</HEAD>

<BODY>
表の作成例<BR>

<TABLE border="2">
  <TR>
    <TH></TH>
    <TH>わたし</TH>
    <TH>さようなら</TH>
    <TH>明日</TH>
  </TR>
  <TR>
    <TH>英語</TH>
    <TD>I</TD>
    <TD>Good‐by</TD>
    <TD>tomorrow</TD>
  </TR>
  <TR>
    <TH>中国語</TH>
    <TD>我</TD>
    <TD>再見</TD>
    <TD>明天</TD>
  </TR>
</TABLE>

</BODY>

</HTML>


PC�p�����y�����l���g�����������}�W�������������z �����������O�~�y�������������z Yahoo �y�V NTT-X Store

�����z�[���y�[�W �������N���W�b�g�J�[�h �C�O�i���q���� ���������[�� �C�O���s�����������I �C�O�z�e��